<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
<div id="main" style="height: 500px;width: 500px"></div>
</body>
<script src="../echarts/dist/echarts.min.js"></script>
<script>
    var mychart=echarts.init(document.getElementById('main'));
    option={
        tooltip:{
            trigger:'item',
            formatter:"{a} </br>>{b}:{c} ({d}%)"
        },
        legend:{
            orient:'vertical',
            x:'left',
            data:['直接访问','邮件直销','联盟广告','视频广告','搜索引擎']
        },
        series:[
            {
                name:'访问来源',
                type:'pie',
                radius:['50%','70%'],
                avoidLabelOverlap:false,
                label:{
                    normal:{//这个是普通显示
                        show:false,//不显示
                        position:'center'//位置在中间
                    },
                    emphasis:{//代替原来的显示。。
                        show:true,
                        textStyle:{
                            fontSize:'30',
                            fontWeight:'bold'
                        }
                    }
                },
                labelLine:{
                    normal:{
                        show:false
                    }
                },
                data:[
                    {value:335,name:'直接访问'},
                    {value:222,name:'邮件营销'},
                    {value:111,name:'联盟广告'},
                    {value:323,name:'视频广告'},
                    {value:432,name:'搜索引擎'},
                ]
            }
        ]
    }
mychart.setOption(option)

</script>
</html>